import 'package:Smart/res/colors_res.dart';
import 'package:Smart/res/font_weight_res.dart';
import 'package:Smart/utils/routers/page_jump_service.dart';
import 'package:flutter/material.dart';
import 'dart:math';
import '../studytest/studytest_pages/study_basics.dart';
import '../studytest/studytest_pages/study_middle.dart';
import '../studytest/studytest_pages/study_actual.dart';
//屏幕适配
import 'package:Smart/utils/screen_unit/gs_screen_util.dart';

class StudyMain006 extends StatefulWidget {
  final String name;
  StudyMain006(this.name);

  @override
  _StudyMain006 createState() => _StudyMain006();
}

class _StudyMain006 extends State<StudyMain006> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      // navigatorKey: PageJumpService.instance().navigatorKey,
      appBar: AppBar(
        leading: GestureDetector(
          onTap: () {
            PageJumpService.instance().goBack();
          },
          child: Icon(
            Icons.arrow_back_ios,
            size: 20.w,
            color: Color(0XFF231815),
          ),
        ),
        elevation: 0,
        backgroundColor: ColorsRes.color_ffffff,
        title: Text(
          "${widget.name}- 学习练习",
          style: TextStyle(color: ColorsRes.color_000000),
        ),
      ),
      body: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key}) : super(key: key);

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    //获取屏幕宽度
    double width = (MediaQuery.of(context).size.width - 90) / 3;
    return Container(
      margin: EdgeInsets.all(20.w),
      child: SingleChildScrollView(
        child: Column(children: <Widget>[
          Container(
            alignment: Alignment.topLeft,
            margin: EdgeInsets.symmetric(vertical: 5.w),
            child: Text(
              '你好，欢迎来到我的成长之路...',
              style: TextStyle(
                  fontSize: 24.w,
                  // color: Colors.black[600],
                  fontWeight: FontWeight.bold),
            ),
          ),
          //中间部分
          Stack(
            children: <Widget>[
              Container(
                width: 500.w,
                height: 300.w,
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(30.w),
                  color: Colors.white,
                ),
                // child: Image.asset('assets/images/productor006/bg.jpg'),
                child: Image.network(
                  'http://imgb13.photophoto.cn/20190116/dengshan-31840590_3.jpg',
                  width: 500.w,
                  height: 300.w,
                  fit: BoxFit.fill,
                ),
              ),
              Container(
                alignment: Alignment.center,
                margin: EdgeInsets.only(top: 80.w),
                child: Column(
                  children: <Widget>[
                    Text(
                      '每天进步一点点',
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 16.w,
                      ),
                    ),
                    Container(
                      padding: EdgeInsets.symmetric(
                          horizontal: 30.w, vertical: 20.w),
                      margin: EdgeInsets.only(top: 10.w),
                      decoration: BoxDecoration(
                        border: Border.all(color: Colors.white, width: 2.w),
                      ),
                      child: Text(
                        'My Flutter',
                        style: TextStyle(
                            color: Colors.white,
                            fontSize: 42.w,
                            fontWeight: FontWeight.bold),
                      ),
                    ),
                  ],
                ),
              )
            ],
          ),
          Container(
            margin: EdgeInsets.fromLTRB(0.w, 10.w, 0.w, 10.w),
            padding: EdgeInsets.symmetric(vertical: 5.w),
            alignment: Alignment.topLeft,
            child: Text(
              '我的进阶之路',
              style: TextStyle(
                  color: Colors.black,
                  fontSize: 16.w,
                  fontWeight: FontWeight.w100),
            ),
          ),
          Container(
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                GestureDetector(
                  onTap: () {
                    PageJumpService.instance().goTo(StudyBasicsPage());
                  },
                  child: Container(
                    width: width,
                    height: 250.w,
                    decoration: BoxDecoration(
                        borderRadius: BorderRadius.only(
                            topRight: Radius.circular(80.w),
                            topLeft: Radius.circular(10.w),
                            bottomRight: Radius.circular(10.w),
                            bottomLeft: Radius.circular(10.w)),
                        color: Colors.red,
                        gradient: LinearGradient(
                            begin: Alignment.topCenter,
                            end: Alignment.bottomCenter,
                            colors: [
                              Color(0xffFE7D82),
                              Color(0xffF7A993),
                            ])),
                    child: Column(
                      children: <Widget>[
                        Container(
                          margin: EdgeInsets.only(top: 80.w),
                          child: Text(
                            '基础知识',
                            style: TextStyle(
                                color: Colors.white,
                                fontSize: 24.w,
                                fontWeight: FontWeightRes.bold),
                          ),
                        ),
                        Container(
                          margin: EdgeInsets.only(top: 5.w),
                          alignment: Alignment.topLeft,
                          padding: EdgeInsets.only(left: 20.w),
                          child: Text(
                            '组件学习',
                            style: TextStyle(
                                color: Colors.white,
                                fontSize: 16.w,
                                fontWeight: FontWeightRes.bold),
                          ),
                        ),
                        Container(
                          margin: EdgeInsets.only(top: 5.w),
                          alignment: Alignment.topLeft,
                          padding: EdgeInsets.only(left: 20.w),
                          child: Text(
                            '页面布局',
                            style: TextStyle(
                                color: Colors.white,
                                fontSize: 16.w,
                                fontWeight: FontWeightRes.bold),
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
                GestureDetector(
                  onTap: () {
                    PageJumpService.instance().goTo(StudyMiddlePage());
                  },
                  child: Container(
                    width: width,
                    height: 250.w,
                    decoration: BoxDecoration(
                        borderRadius: BorderRadius.only(
                            topRight: Radius.circular(80.w),
                            topLeft: Radius.circular(10.w),
                            bottomRight: Radius.circular(10.w),
                            bottomLeft: Radius.circular(10.w)),
                        color: Colors.red,
                        gradient: LinearGradient(
                            begin: Alignment.topCenter,
                            end: Alignment.bottomCenter,
                            colors: [
                              Color(0xff7589E7),
                              Color(0xff6064DA),
                            ])),
                    child: Column(
                      children: <Widget>[
                        Container(
                          margin: EdgeInsets.only(top: 80.w),
                          child: Text(
                            '功能案例',
                            style: TextStyle(
                                color: Colors.white,
                                fontSize: 24.w,
                                fontWeight: FontWeightRes.bold),
                          ),
                        ),
                        Container(
                          margin: EdgeInsets.only(top: 5.w),
                          alignment: Alignment.topLeft,
                          padding: EdgeInsets.only(left: 20.w),
                          child: Text(
                            '复杂页面',
                            style: TextStyle(
                                color: Colors.white,
                                fontSize: 16.w,
                                fontWeight: FontWeightRes.bold),
                          ),
                        ),
                        Container(
                          margin: EdgeInsets.only(top: 5.w),
                          alignment: Alignment.topLeft,
                          padding: EdgeInsets.only(left: 20.w),
                          child: Text(
                            '功能实现',
                            style: TextStyle(
                                color: Colors.white,
                                fontSize: 16.w,
                                fontWeight: FontWeightRes.bold),
                          ),
                        ),
                        Container(
                          margin: EdgeInsets.only(top: 5.w),
                          alignment: Alignment.topLeft,
                          padding: EdgeInsets.only(left: 20.w),
                          child: Text(
                            '常用技术',
                            style: TextStyle(
                                color: Colors.white,
                                fontSize: 16.w,
                                fontWeight: FontWeightRes.bold),
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
                GestureDetector(
                  onTap: () {
                    PageJumpService.instance().goTo(StudyActualPage());
                  },
                  child: Container(
                    width: width,
                    height: 250.w,
                    decoration: BoxDecoration(
                        borderRadius: BorderRadius.only(
                            topRight: Radius.circular(80.w),
                            topLeft: Radius.circular(10.w),
                            bottomRight: Radius.circular(10.w),
                            bottomLeft: Radius.circular(10.w)),
                        color: Colors.red,
                        gradient: LinearGradient(
                            begin: Alignment.topCenter,
                            end: Alignment.bottomCenter,
                            colors: [
                              Color(0xffFF95B7),
                              Color(0xffF25185),
                            ])),
                    child: Column(
                      children: <Widget>[
                        Container(
                          margin: EdgeInsets.only(top: 80.w),
                          child: Text(
                            '项目实战',
                            style: TextStyle(
                                color: Colors.white,
                                fontSize: 24.w,
                                fontWeight: FontWeightRes.bold),
                          ),
                        ),
                      ],
                    ),
                  ),
                )
              ],
            ),
          )
        ]),
      ),
    );
  }
}

//进度条
class CirclePercentProgress extends StatefulWidget {
  final double progress;

  const CirclePercentProgress({Key key, this.progress}) : super(key: key);

  @override
  _CirclePercentProgressState createState() => _CirclePercentProgressState();
}

class _CirclePercentProgressState extends State<CirclePercentProgress> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return CustomPaint(
      painter: _CircleProgressPaint(min(1, max(0, widget.progress))),
    );
  }
}

class _CircleProgressPaint extends CustomPainter {
  final double progress;

  _CircleProgressPaint(this.progress);

  final Paint circlePaint = Paint()
    ..style = PaintingStyle.stroke
    ..strokeWidth = 10;

  @override
  void paint(Canvas canvas, Size size) {
    final radius =
        min(size.width, size.height) / 2 - circlePaint.strokeWidth / 2;
    final rect = Rect.fromCircle(
        radius: radius,
        center: Offset(
          size.width / 2,
          size.height / 2,
        ));
    circlePaint.shader = null;
    circlePaint.color = Colors.grey;
    canvas.drawArc(rect, 0, pi * 2, false, circlePaint);
    circlePaint.shader =
        SweepGradient(colors: [Colors.limeAccent, Colors.limeAccent])
            .createShader(rect);
    canvas.drawArc(rect, -1.5, pi * 2.5 * progress, false, circlePaint);
  }

  @override
  bool shouldRepaint(covariant _CircleProgressPaint oldDelegate) {
    return true;
  }
}
